import 'package:flutter/material.dart';


class KeyValueView extends StatefulWidget{
  Map<Object, Object> data;
  double width;
  EdgeInsetsGeometry padding;
  EdgeInsetsGeometry margin;
  Color textColor;

  KeyValueView(this.data, {this.width = 250.0, this.padding, this.margin, this.textColor = Colors.black});

  @override
  State<StatefulWidget> createState(){
    return KeyValueViewsState();
  }
}

class KeyValueViewsState extends State<KeyValueView> {
  KeyValueViewsState();

  @override
  Widget build(BuildContext context) {
    var items = List<Widget>();
    widget.data.forEach((key, value) {
      items.add(buildItem(MapEntry(key, value)));
    });

    return Container(
      padding: widget.padding,
      margin: widget.margin,
      width: widget.width,
//      color: Colors.red,
      child: Wrap(
        children: items,
      ),
    );
  }

  Widget buildItem(MapEntry<Object, Object> data) {
    return Row(
      children: <Widget>[
        Expanded(child: Text(data.key.toString(), textAlign: TextAlign.start, style: TextStyle(color: widget.textColor),), flex: 2,),
        Expanded(child: Text(data.value.toString(), textAlign: TextAlign.end, style: TextStyle(color: widget.textColor),), flex: 3,),
      ],
    );
  }
}

